import React, { useState, useEffect } from 'react';
import { StyleSheet, Text, View, Image, FlatList } from 'react-native';
import { scaleSizeH, scaleSizeW, setSpText } from '../../util/ScreenUtil.js';
import HotMovieItem from './HotMovieItem';
import MovieService from '../../services/movie'

const HotMovie=(props)=> {
    // 声明一个新的叫做 “count” 的 state 变量
    const [movieData, setMovieData] = useState([]);
    const [pageData, setPageData] = useState({})
    const [refreshing, setRefreshing] = useState(false)
    const getData = async (result={ curPage:1, eachPage:5, status:"0" }) => {
        setRefreshing(true)
        let data = await MovieService.GetMovies(result)
        if (result.curPage!=1) {
        setMovieData([...movieData,...data.rows])
        }else{
            setMovieData(data.rows)
        }
        const {curPage,eachPage}=data
        setPageData({curPage,eachPage})
        setRefreshing(false)
    }
    useEffect(() => {
        getData()        
    }, []);
    function onRefresh() {
        getData()
    }
    function onEndReached(){
        setRefreshing(true)
        getData({curPage:parseInt(pageData.curPage)+1,eachPage:5,status:"0"})
        setRefreshing(false)
    }
    return (
            <FlatList
                refreshing={refreshing}
                onEndReached={onEndReached}
                onEndReachedThreshold={0.05}
                data={movieData}
                onRefresh={onRefresh}
                showsVerticalScrollIndicator={false}
                keyExtractor={(item, index) => item._id}
                renderItem={({ item, index }) =>
                    <HotMovieItem navigation={props.screenProps} key={item._id} data={item}></HotMovieItem>
                }
            />
    );
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
    img: {
        width: scaleSizeW(750),
        height: scaleSizeH(1500)
    }
});
export default HotMovie
HotMovie.navigationOptions = () => {
    return {
        title: "正在热映",
       
    };
};